<!-- 这个是我自己写的一个简化的 -->
<template> 
  <div>
    <el-upload
      action="https://gulimall-product231231.oss-cn-hangzhou.aliyuncs.com"
      :data="dataObj"
      :file-list="fileList"
      :before-upload="beforeUpload"
      :on-success="handleUploadSuccess"
      :on-remove="handleRemove"
      accept=".png,.jpg"
      list-type="picture">
      <el-button size="small" type="primary">点击上传</el-button>
      <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过10MB</div>
    </el-upload>
  </div>
</template>
<script>
   import {policy} from './policy'
   import { getUUID } from '@/utils'

  export default {
    name: 'singleUpload',
    data() {
      return {
        dataObj: {},
        fileList: []
      };
    },
    methods: {
      handleRemove(file, fileList) {
        fileList.pop()
        console.log("file",file,"newfileList",fileList)
        this.$emit('input', '')
      },
      beforeUpload(file) {
        return new Promise((resolve, reject) => {
          policy().then(response => {
            this.dataObj={
              policy : response.data.policy,
              signature: response.data.signature,
              ossaccessKeyId: response.data.accessid,
              key: response.data.dir + '/'+getUUID()+"_"+file.name,
              dir: response.data.dir,
              host: response.data.host,
            }

            console.log("this.dataObj",this.dataObj)
            resolve(true)
          }).catch(err => {
            reject(false)
          })
        })

      },
      handleUploadSuccess(res, file) {
        console.log("上传成功...",file)
        this.fileList = [{name: file.name, url: this.dataObj.host + '/' + this.dataObj.key }]
        this.$emit('input', this.fileList[0].url)
      }
    }
  }
</script>
<style>

</style>


